<template>
  <n-list style=" min-height: 498px;" hoverable clickable>
    <n-list-item v-for="item in data" :key="item.station_id" style="padding: 14.2px 20px">
      <template #prefix>
        <n-avatar :size="48" :src="item.sitepicture" />
      </template>
      <template #suffix>
        <n-tag type="success">{{ item.count }}</n-tag>
      </template>
      <n-thing :title="item.name">
        <template #description>
          <n-text depth="3">地址：{{ item.full_address }}</n-text>
        </template>
      </n-thing>
    </n-list-item>
  </n-list>
</template>

<script lang="ts" setup>
  import { ref,onMounted } from 'vue';
  import { payorderpaihang } from '@/api/tongji/index';

  const data = ref([
    {
      station_id: '',
      sitepicture: '',
      full_address: '',
      name: '',
      count: 0,
    }
  ]);

  onMounted(async () => {
    data.value = [];
    const res1 = await payorderpaihang({ });
    data.value = res1
  });
</script>
